// 运动函数
// 参数1: 运动的标签对象
// 参数2: 运动的css属性和最终值 对象结构
// 参数3: 运动结束执行的函数程序 默认值是 空函数
function move(element , object , callback = function(){}){
    // 1, 定义变量 存储 定时器个数
    let num = 0 ;

    // 2, 循环遍历参数2这个对象
    for( let type in object ){
        // 2-1 变量累加1 表示 有一个定时器生成
        num++;

        // 2-2 根据 type 存储的当前属性 获取 初始值 和 最终值
        // 兼容透明度

        // 初始值
        let startVal = type === 'opacity' ? window.getComputedStyle(element)[type]*100 : parseInt( window.getComputedStyle(element)[type] );                
    
        // 最终值
        let endVal = type === 'opacity' ? object[type]*100 : object[type] ;

        // 2-3 定义定时器
        let time = setInterval(function(){
            // 计算步长 (最终值 - 初始值) / 份数
            let step = ( endVal - startVal ) / 10 ;

            // 步长值 取整
            // 大于0 向上取整
            // 小于0 向下取整
            step = step > 0 ? Math.ceil( step ) : Math.floor( step );

            // 初始值累加步长值
            startVal += step ;

            // 将 新的初始值 赋值给 标签css属性
            // 兼容 透明度
            element.style[type] = type === 'opacity' ? startVal / 100 : startVal +'px';

            // 判断 初始值 如果 累加至 最终值
            if( startVal === endVal ){
                // 清除定时器
                clearInterval( time );
                // 变量-- 
                num--;
                // 如果num是0 证明定时器都清除了
                // 也就是运动都结束了 调用 参数3的函数
                callback();
            }

        } , 30 );
    
    
    
    }
}